<template>

	<view class="my-container">
		<!-- 顶部用户信息区域 -->
		<view class="user-section" :style="{'backgroundImage': `url(${serverAddress}img/juxing6@2x.png)`}">

			<view class="status-bar"></view>

			<view class="nav-bar">
				<view class="nav-title">我的</view>

			</view>
			<view class="nav-actions">
				<image class="nav-icon" :src="serverAddress+'img/icon-wuxinxi@2x.png'" @click="goMessages"></image>
				<image class="nav-icon" :src="serverAddress+'img/icon-Set-up@3x.png'" @click="goSettings"></image>
			</view>
			<view class="user-card">
				<view class="user-info" @click="goToProfile">
					<view class="avatar-container">
						<image class="avatar"
							:src="userInfo.avatar?serverAddress+userInfo.avatar: serverAddress+'img/motou.png'"
							mode="aspectFill"></image>
						<image v-if="userInfo.isVip" class="crown" :src="serverAddress+'img/img/23@3x.svg'"></image>
					</view>
					<view class="user-details">
						<view class="nickname">{{ userInfo.nickname || '点击登录' }}</view>
						<view class="invite-code" v-if="isLogin">邀请码: {{ userInfo.inviteCode }}</view>
						<view class="login-tip" v-else>登录享受更多权益</view>
					</view>
				</view>
				<!-- <view class="user-right" v-if="isLogin">
					<view class="yesterday-income">
						<text class="income-amount">¥{{ profitInfo || '0.00' }}</text>
						<text class="income-label">昨日收益</text>
					</view>
				</view> -->
			</view>


		</view>

		<!-- 身份申请区域 -->
		<view class="privilege-card" :style="{'backgroundImage': `url(${serverAddress}img/zz.png)`}">

			<view class="privilege-header">
				<view class="privilege-info">
					<view class="privilege-desc">云主特权专享价 ¥<view class="privilege-price">{{ cloudPrice }}</view>/年</view>
				</view>
				<view class="privilege-benefits">
					<text class="benefits-text">申请身份 · 身份越多收益越多</text>
				</view>
			</view>

			<view>
				<view class="apply-btn" @click="applyIdentity">
					立即申请
				</view>
			</view>

		</view>

		<!-- 钱包信息 -->
		<view class="wallet-section">
			<view class="wallet-item">
				<text class="wallet-label">待分润:</text>
				<text class="wallet-value">¥ {{financeData.pendingProfit || '0.00' }}元</text>
			</view>
			<view class="wallet-divider"></view>
			<view class="wallet-item">
				<text class="wallet-label">已分润:</text>
				<text class="wallet-value">¥ {{ financeData.completedProfit || '0.00' }}元</text>
			</view>
		</view>

		<!-- 功能快捷入口 -->
		<view class="quick-entry">
			<view class="entry-item" @click="goProfitDetail('total')">
				<view class="entry-icon">
					<image class="profit-icon" :src="serverAddress+'img/benefit.png'"></image>
				</view>
				<text class="entry-text">累计收益</text>
			</view>
			<view class="divider"></view>
			<view class="entry-item" @click="goWallet">
				<view class="entry-icon wallet-icon">
					<image class="entry-icon" :src="serverAddress+'img/wallet.png'"></image>
				</view>
				<text class="entry-text">我的钱包</text>
			</view>
			<view class="divider"></view>
			<view class="entry-item" @click="goTeam">
				<view class="entry-icon">
					<image class="team-icon" :src="serverAddress+'img/myteam.png'"></image>
				</view>
				<text class="entry-text">我的团队</text>
			</view>

		</view>

		<!-- 订单管理 -->
		<view class="order-section">
			<view class="section-header" @click="goOrderList('all')">
				<text class="header-title">商城订单</text>
				<view class="header-action">
					<text class="action-text">全部商城订单</text>
					<u-icon name="arrow-right" size="14" color="#999"></u-icon>
				</view>
			</view>
			<view class="line"></view>
			<view class="order-status">
				<view class="status-item" @click="goOrderList('pending')">
					<view class="order-icon-container">
						<image class="order-icon" :src="serverAddress+'img/order1.png'"></image>
					</view>
					<text class="status-text">待付款</text>
				</view>
				<view class="status-item" @click="goOrderList('shipped')">
					<view class="order-icon-container">
						<image class="order-icon" :src="serverAddress+'img/order2.png'"></image>
						<view v-if="orderCounts.shipped > 0" class="order-badge">{{ orderCounts.shipped }}</view>
					</view>
					<text class="status-text">待发货</text>
				</view>
				<view class="status-item" @click="goOrderList('delivered')">
					<view class="order-icon-container">
						<image class="order-icon" :src="serverAddress+'img/order5.png'"></image>
						<view v-if="orderCounts.delivered > 0" class="order-badge">{{ orderCounts.delivered }}
						</view>
					</view>
					<text class="status-text">待收货</text>
				</view>
				<view class="status-item" @click="goOrderList('comment')">
					<view class="order-icon-container">
						<image class="order-icon" :src="serverAddress+'img/order3.png'"></image>
						<view v-if="orderCounts.comment > 0" class="order-badge">{{ orderCounts.comment }}</view>
					</view>
					<text class="status-text">待评论</text>
				</view>
				<view class="status-item" @click="goOrderList('refund')">
					<view class="order-icon-container">
						<image class="order-icon" :src="serverAddress+'img/order4.png'"></image>
						<view v-if="orderCounts.refund > 0" class="order-badge">{{ orderCounts.refund }}</view>
					</view>
					<text class="status-text">退换货</text>
				</view>
			</view>
		</view>


		<!-- 功能菜单卡片 -->
		<view class="menu-card">
			<view class="menu-grid">
				<view class="menu-item" @click="goGroupOrder">
					<image class="menu-icon" :src="serverAddress+'img/图层19@2x.png'"></image>
					<text class="menu-text">团购订单</text>
					<image class="menu-arrow" src="/static/icons/more.png"></image>
				</view>
				<view class="menu-item" @click="goQrCode">
					<image class="menu-icon" :src="serverAddress+'img/图层20@2x.png'"></image>
					<text class="menu-text">邀请二维码</text>
					<image class="menu-arrow" src="/static/icons/more.png"></image>
				</view>
				<view class="menu-item" @click="goLecture">
					<image class="menu-icon" :src="serverAddress+'img/图层21@2x.png'"></image>
					<text class="menu-text">优享优品讲堂</text>
					<image class="menu-arrow" src="/static/icons/more.png"></image>
				</view>
				<view class="menu-item" @click="goCustomerService">
					<image class="menu-icon" :src="serverAddress+'img/图层22@2x.png'"></image>
					<text class="menu-text">优享优品客服</text>
					<image class="menu-arrow" src="/static/icons/more.png"></image>
				</view>
			</view>
		</view>
		<!-- </view> -->

		<!-- 客服电话弹窗 -->
		<u-modal :show="showCustomerService" content="客服电话 : 010-65776071" :showCancelButton="true" :confirm-text="'拨打'"
			@confirm="makePhoneCall()" @cancel="showCustomerService=false"></u-modal>

		<!-- 网站安全保密协议弹窗 -->
		<security-agreement-modal :show="showSecurityAgreement" @confirm="agreeSecurityAgreement"
			@cancel="showSecurityAgreement = false" />


		<!-- 动态底部导航 -->
		<dynamic-tabbar></dynamic-tabbar>
	</view>
</template>

<script>
	import api from '@/api/index.js'
	import {
		isLoggedIn,
		getCurrentUser,
		goToLogin,
		clearLoginInfo
	} from '@/api/auth.js'
	import {
		inject
	} from 'vue'
	import DynamicTabbar from '@/components/dynamic-tabbar.vue'
	import SecurityAgreementModal from '@/components/SecurityAgreementModal.vue';
	export default {
		components: {
			DynamicTabbar,
			SecurityAgreementModal
		},
		data() {
			return {
				serverAddress: inject('$serverAddress'),
				isLogin: false, // 登录状态
				messageCount: 0, // 消息数量
				userInfo: {
					nickname: '',
					avatar: '',
					inviteCode: '',
					isVip: false,
					region: 0,
					regionName: '',
					isPartner: false,
					isAgent: false,
					isMerchant: false,
					isManufac: false,
					isStaff: false
				},
				orderCounts: {
					pending: 0,
					shipped: 0,
					delivered: 0,
					comment: 0,
					refund: 0
				},
				// 财务数据
				financeData: {
					pendingProfit: '0.00', // 昨日分润 Yestprofit
					completedProfit: '0.00', // 累计收益 Totalincome
					totalEarnings: '0.00', // 累计收益
					zbRebate: '0.00', // 直播返利
					alRebate: '0.00', // 阿里返利
					partnerIncomeTotal: '0.00', // 合伙人总收益
					shareNum: '0', // 分享数量
					ptnGrowth: 0 // 合伙人增长
				},
				// 钱包信息
				walletInfo: {
					balance: '0.00',
					points: '0',
					coupons: '0'
				},
				// 云主价格
				cloudPrice: '365',
				loading: false,
				// 微信Token信息
				wxTokenInfo: {
					nonceStr: '',
					timestamp: '',
					signature: '',
					appId: '',
					appSecret: '',
					url: '',
					rawString: ''
				},
				// 客服弹窗状态
				showCustomerService: false,
				// 安全协议弹窗状态
				showSecurityAgreement: false,
				// 特权卡片背景图片
				privilegeCardBgImage: 'privilege-bg.png',
				profitInfo: {}
			}
		},
		onLoad() {
			this.checkLoginStatus()
			// this.loadUserData()
			// 加载分润信息
			this.loadProfitInfo()
			// 加载钱包信息
			// this.loadWalletInfo()
			// 加载云主价格
			this.loadCloudPrice()
		},

		onShow() {
			// 页面显示时刷新数据
			this.checkLoginStatus()
			this.loadUserData()
		},

		// 下拉刷新
		onPullDownRefresh() {
			this.loadUserData().finally(() => {
				uni.stopPullDownRefresh()
			})
		},
		computed: {

		},
		methods: {
			// 检查登录状态
			checkLoginStatus() {
				this.isLogin = isLoggedIn();
				this.userInfo = getCurrentUser() || {};
			},

			// 加载用户数据
			async loadUserData() {
				console.log('====this.isLogin======', this.isLogin)
				// if (!this.isLogin) return

				// if (this.loading) return

				try {
					this.loading = true

					// 并行请求用户信息、未登录信息、收益信息、微信Token检查
					const [userResult, unlogResult, incomeResult, tokenResult] = await Promise.allSettled([
						this.getUserMyInfo(),
						this.getUnlogInfo(),
						this.getIncomeInfo(),
						this.checkWxToken()
					])

					// 处理用户信息 - /home/User/my接口返回
					if (userResult.status === 'fulfilled' && userResult.value.r === 0) {
						const userData = userResult.value.data
						console.log('=====userData======', userData)
						this.userInfo = {
							id: userData.user_id || this.userInfo.id,
							nickname: userData.nickname || userData.username || this.userInfo.nickname,
							avatar: userData.small_head || 'img/motou.png',
							inviteCode: userData.invite_code || this.userInfo.inviteCode,
							region: userData.region,
							regionName: userData.regionname,
							isPartner: userData.is_partner == 1,
							isAgent: userData.is_agent == 1,
							isMerchant: userData.is_merchant == 1,
							isManufac: userData.is_manufac == 1,
							isStaff: userData.is_staff == 1,
							isVip: userData.is_partner == 1 || userData.is_agent == 1 || userData.is_merchant ==
								1 || userData.is_manufac == 1 || userData.is_staff == 1
						}
						console.log('=====userInfo======', this.userInfo)

						// 更新财务数据
						this.financeData = {
							pendingProfit: userData.Yestprofit || '0.00',
							completedProfit: userData.Totalincome || '0.00',
							totalEarnings: userData.Totalincome || '0.00',
							zbRebate: userData.zbRebate || '0.00',
							alRebate: userData.AlRebate || '0.00'
						}

						// 更新订单统计
						this.orderCounts = {
							pending: userData.payment || 0,
							shipped: userData.Delivergoods || 0,
							delivered: userData.Goodsreceipt || 0,
							comment: userData.eval || 0,
							refund: userData.refund || 0
						}

						// 更新本地存储
						uni.setStorageSync('user_info', this.userInfo)
					}

					// 处理未登录信息 - /home/User/unloginfo接口返回
					if (unlogResult.status === 'fulfilled' && unlogResult.value.r === 0) {
						const unlogData = unlogResult.value.data
						this.cloudPrice = unlogData.staff_fee || '365'
					}

					// 处理收益信息 - /home/User_income/getIncome接口返回
					if (incomeResult.status === 'fulfilled' && incomeResult.value.r === 0) {
						const incomeData = incomeResult.value.data
						// 更新收益相关数据
						this.financeData.partnerIncomeTotal = incomeData.partner_income_total || '0.00'
						this.financeData.shareNum = incomeData.share_num || '0'
						this.financeData.ptnGrowth = incomeData.ptn_growth || 0
					}

					// 处理微信Token信息 - /wap/wx_help/checkToken接口返回
					if (tokenResult.status === 'fulfilled' && tokenResult.value) {
						const tokenData = tokenResult.value
						this.wxTokenInfo = {
							nonceStr: tokenData.nonceStr || '',
							timestamp: tokenData.timestamp || '',
							signature: tokenData.signature || '',
							appId: tokenData.appId || '',
							appSecret: tokenData.appSecret || '',
							url: tokenData.url || '',
							rawString: tokenData.rawString || ''
						}
					}

				} catch (error) {
					console.error('加载用户数据失败:', error)
				} finally {
					this.loading = false
				}
			},

			// 获取用户我的页面信息
			async getUserMyInfo() {
				return api.userApi.getMyInfo()
			},

			// 获取未登录信息
			async getUnlogInfo() {
				return api.userApi.getUnlogInfo()
			},

			// 获取收益信息
			async getIncomeInfo() {
				return api.userApi.getIncomeInfo()
			},

			// 检查微信Token
			async checkWxToken() {
				return api.wechatApi.checkToken()
			},

			// 加载分润信息 - 已更新为使用新接口
			async loadProfitInfo() {
				if (!this.isLogin) return

				try {
					// 获取收益信息 - 使用新的接口
					const incomeRes = await this.getIncomeInfo()
					if (incomeRes.r === 0) {
						this.financeData.partnerIncomeTotal = incomeRes.data.partner_income_total || '0.00'
						this.financeData.shareNum = incomeRes.data.share_num || '0'
						this.financeData.ptnGrowth = incomeRes.data.ptn_growth || 0
					}
				} catch (error) {
					console.error('加载分润信息失败:', error)
				}
			},

			// 加载钱包信息
			async loadWalletInfo() {
				if (!this.isLogin) return

				try {
					const res = await api.walletApi.getWalletInfo()
					if (res.r === 0) {
						this.walletInfo = {
							balance: res.data.balance || '0.00',
							points: res.data.points || '0',
							coupons: res.data.coupons || '0'
						}
					}
				} catch (error) {
					console.error('加载钱包信息失败:', error)
				}
			},

			// 加载云主价格 - 已更新为使用新接口
			async loadCloudPrice() {
				try {
					const res = await this.getUnlogInfo()
					if (res.r === 0) {
						this.cloudPrice = res.data.staff_fee || '365'
					}
				} catch (error) {
					console.error('加载云主价格失败:', error)
				}
			},

			// 跳转消息中心
			goMessages() {
				console.log('=========message==========')
				uni.navigateTo({
					url: '/pages/news/notice-list'
				})
			},

			// 跳转设置
			goSettings() {
				uni.navigateTo({
					url: '/pages/my/settings'
				})
			},

			// 跳转钱包
			goToWallet() {
				if (!this.isLogin) {
					this.goLogin()
					return
				}
				uni.navigateTo({
					url: '/pages/my/wallet'
				})
			},

			// 跳转团队
			goToTeam() {
				if (!this.isLogin) {
					this.goLogin()
					return
				}
				uni.navigateTo({
					url: '/pages/my/team/index'
				})
			},

			// 跳转登录
			goLogin() {
				goToLogin();
			},

			// 跳转个人资料
			goToProfile() {
				if (!this.isLogin) {
					this.goLogin()
					return
				}
				uni.navigateTo({
					url: '/pages/my/profile'
				})
			},

			
			


			// 跳转订单列表
			goOrderList(status = '') {
				if (!this.isLogin) {
					this.goLogin()
					return
				}
				// 将'all'转换为'1'，因为订单列表页面使用'1'表示全部
				const statusParam = status === 'all' ? '1' : status
				const url = statusParam ? `/pages/order/list?status=${statusParam}` : '/pages/order/list'
				uni.navigateTo({
					url
				})
			},
			// 跳转待评价订单列表
			goOrderListWaitComment(status = '') {
				// if (!this.isLogin) {
				// 	this.goLogin()
				// 	return
				// }

				uni.navigateTo({
					url: `/pages/order/wait-comment?status=${status}`
				})
			}, // 跳转退换货订单列表
			goOrderListRefund(status = '') {
				// if (!this.isLogin) {
				// 	this.goLogin()
				// 	return
				// }

				uni.navigateTo({
					url: `/pages/order/refund-list?status=${status}`
				})
			},
			// 跳转分润详情
			goProfitDetail(type) {
				// if (!this.isLogin) {
				// 	this.goLogin()
				// 	return
				// }
				uni.navigateTo({
					url: `/pages/profit/detail?type=${type}`
				})
			},

			// 跳转钱包
			goWallet(type = '') {
				// if (!this.isLogin) {
				// 	this.goLogin()
				// 	return
				// }
				const url = type ? `/pages/my/wallet?type=${type}` : '/pages/my/wallet'
				uni.navigateTo({
					url
				})
			},

			// 跳转团队
			goTeam() {
				// if (!this.isLogin) {
				// 	this.goLogin()
				// 	return
				// }
				uni.navigateTo({
					url: '/pages/my/team/index'
				})
			},

			// 跳转收益详情
			goToEarnings() {
				if (!this.isLogin) {
					this.goLogin()
					return
				}
				uni.navigateTo({
					url: '/pages/my/earnings'
				})
			},

			// 申请身份
			applyIdentity() {



				if (!this.isLogin) {
					this.goLogin()
					return
				}
				this.showSecurityAgreement = true

			},

			// 跳转团购订单
			goGroupOrder() {
				// if (!this.isLogin) {
				// 	this.goLogin()
				// 	return
				// }
				uni.navigateTo({
					url: '/pages/order/group'
				})
			},

			// 跳转邀请二维码
			goQrCode() {
				if (!this.isLogin) {
					this.goLogin()
					return
				}
				uni.navigateTo({
					url: '/pages/invite/qrcode'
				})
			},

			// 跳转讲座
			goLecture() {
				uni.navigateTo({
					url: '/pages/my/classroom'
				})
			},

			// 跳转客服
			goCustomerService() {
				this.showCustomerService = true
			},

			// 拨打客服电话
			makePhoneCall() {
				uni.makePhoneCall({
					phoneNumber: '010-65776071',
					success: () => {
						console.log('拨打电话成功')
					},
					fail: (err) => {
						console.error('拨打电话失败:', err)
						uni.showToast({
							title: '拨打失败',
							icon: 'none'
						})
					}
				})
				this.showCustomerService = false
			},

			// 显示安全协议
			showSecurityAgreementModal() {
				this.showSecurityAgreement = true
			},

			// 同意安全协议
			agreeSecurityAgreement() {
				// 这里可以添加同意协议后的逻辑，比如保存用户同意状态
				uni.setStorageSync('security_agreement_agreed', true)
				uni.showToast({
					title: '已同意协议',
					icon: 'success'
				})
				this.showSecurityAgreement = false
				uni.navigateTo({
					url: '/pages/identity/shenqing_more'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		background: #f8f9fa;
		min-height: 100vh;
		padding-bottom: calc(50px + env(safe-area-inset-bottom));
	}

	/* 顶部背景区域 */
	.header-bg {
		background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
		padding-bottom: 40rpx;
		position: relative;
	}

	.status-bar {
		height: 44px;
	}

	.nav-bar {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 30rpx;
		height: 88rpx;
	}

	.nav-title {
		color: white;
		font-size: 36rpx;
		font-weight: bold;
	}

	.nav-actions {
		display: flex;
		gap: 30rpx;
		margin-top: 20rpx;
		justify-content: flex-end;
	}

	.nav-icon {
		width: 48rpx;
		height: 48rpx;
	}

	/* 用户信息卡片 */
	.user-card {
		backdrop-filter: blur(10px);
		border-radius: 24rpx;
		padding: 10rpx 0rpx 0;
	}

	.user-info {
		display: flex;
		align-items: center;
		margin-bottom: 40rpx;
	}

	.avatar-container {
		position: relative;
		margin-right: 30rpx;
	}

	.avatar {
		width: 120rpx;
		height: 120rpx;
		border-radius: 50%;
		border: 4rpx solid rgba(255, 255, 255, 0.3);
	}

	.crown {
		position: absolute;
		top: -10rpx;
		right: -10rpx;
		width: 40rpx;
		height: 40rpx;
	}

	.user-details {
		flex: 1;
	}

	.nickname {
		color: white;
		font-size: 36rpx;
		font-weight: bold;
		margin-bottom: 10rpx;
	}

	.invite-code,
	.login-tip {
		color: rgba(255, 255, 255, 0.8);
		font-size: 26rpx;
	}

	.quick-actions {
		display: flex;
		justify-content: space-around;
	}

	.action-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 15rpx;
	}

	.action-icon {
		width: 60rpx;
		height: 60rpx;
	}

	.action-text {
		color: white;
		font-size: 24rpx;
	}

	/* 主要内容区域 */
	.main-content {
		padding: 0 30rpx;
		margin-top: -20rpx;
	}

	/* 云主特权卡片 */
	.privilege-card {
		display: flex;
		align-items: center;
		background-repeat: no-repeat;
		justify-content: space-between;
		border-radius: 24rpx 24rpx 0 0;
		padding: 20rpx 30rpx 0;
		margin-bottom: 30rpx;
		margin: -175rpx 80rpx 0;
	}

	.privilege-header {
		display: flex;
		flex-direction: column;
	}

	.privilege-info {
		display: flex;
	}

	.privilege-title {
		color: #333;
		font-size: 32rpx;
		font-weight: bold;
		display: block;
		margin-bottom: 8rpx;
	}

	.privilege-price {
		color: red;
		font-size: 32rpx;
		font-weight: bold;
		display: block;
		margin-bottom: 8rpx;
	}

	.privilege-desc {
		color: #666;
		font-size: 26rpx;
		color: white;
		display: flex;
		align-items: center;
	}

	.apply-btn {
		background: #FF7F29;
		color: white;
		padding: 10rpx 30rpx;
		border-radius: 50rpx;
		font-size: 28rpx;
		font-weight: bold;
	}

	.privilege-benefits {
		text-align: center;
	}

	.benefits-text {
		color: #fff;
		font-size: 24rpx;
	}

	/* 财务数据卡片 */
	.finance-card {
		background: white;
		border-radius: 24rpx;
		padding: 40rpx 30rpx;
		margin-bottom: 30rpx;
		box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.08);
	}

	.finance-header,
	.card-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 30rpx;
	}

	.card-title {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
	}

	.more-link {
		color: #667eea;
		font-size: 26rpx;
	}

	.finance-grid {
		display: flex;
		align-items: center;
	}

	.finance-item {
		flex: 1;
		text-align: center;
	}

	.finance-value {
		display: block;
		font-size: 36rpx;
		font-weight: bold;
		color: #333;
		margin-bottom: 10rpx;
	}

	.finance-label {
		color: #666;
		font-size: 24rpx;
	}

	.finance-divider {
		width: 2rpx;
		height: 60rpx;
		background: #f0f0f0;
	}

	/* 订单管理卡片 */
	.order-card {
		background: white;
		border-radius: 24rpx;
		padding: 40rpx 30rpx;
		margin-bottom: 30rpx;
		box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.08);
	}

	.order-grid {
		display: flex;
		justify-content: space-between;
	}

	.order-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 15rpx;
	}

	.order-icon-container {
		position: relative;
	}

	.order-icon {
		width: 50rpx;
		height: 50rpx;
	}

	.order-badge {
		position: absolute;
		top: -10rpx;
		right: -10rpx;
		background: #ff4757;
		color: white;
		border-radius: 50%;
		width: 36rpx;
		height: 36rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 20rpx;
	}

	.order-text {
		color: #666;
		font-size: 24rpx;
	}

	/* 功能菜单卡片 */
	.menu-card {
		background: white;
		border-radius: 24rpx;
		margin-bottom: 30rpx;
		margin: 0 30rpx;
		box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.08);
	}

	.menu-grid {
		padding: 0;
	}

	.menu-item {
		display: flex;
		align-items: center;
		padding: 30rpx;
		border-bottom: 2rpx solid #f8f9fa;
	}

	.menu-item:last-child {
		border-bottom: none;
	}

	.menu-icon {
		width: 48rpx;
		height: 48rpx;
		margin-right: 30rpx;
	}

	.menu-text {
		flex: 1;
		color: #333;
		font-size: 30rpx;
	}

	.menu-arrow {
		width: 32rpx;
		height: 32rpx;
		opacity: 0.5;
	}


	.my-container {
		background-color: #f7f7f7;
		min-height: 100vh;
		padding-bottom: calc(50px + env(safe-area-inset-bottom));
	}

	/* 用户信息区域 */
	.user-section {
		// background: linear-gradient(135deg, #11b445 0%, #0ea83a 100%);
		// background-image: url('/static/icons/juxing6@2x.png');
		padding: 0rpx 30rpx 160rpx;
		// position: relative;
		background-repeat: no-repeat;

		.user-header {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 30rpx;

			.page-title {
				font-size: 36rpx;
				font-weight: bold;
				color: #fff;
			}

			.header-actions {
				display: flex;
				gap: 30rpx;

				.action-item {
					position: relative;
					padding: 10rpx;

					.message-badge {
						position: absolute;
						top: -5rpx;
						right: -5rpx;
						background-color: #ff4757;
						border-radius: 50%;
						min-width: 30rpx;
						height: 30rpx;
						display: flex;
						align-items: center;
						justify-content: center;

						.badge-text {
							font-size: 20rpx;
							color: #fff;
							line-height: 1;
						}
					}
				}
			}
		}

		.user-info {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-bottom: 40rpx;

			.user-left {
				display: flex;
				align-items: center;
				flex: 1;

				.user-avatar {
					position: relative;
					margin-right: 30rpx;

					.avatar-image {
						width: 120rpx;
						height: 120rpx;
						border-radius: 50%;
						border: 4rpx solid rgba(255, 255, 255, 0.3);
						background-color: #f0f0f0;
					}

					.crown-icon {
						position: absolute;
						top: -10rpx;
						left: 50%;
						transform: translateX(-50%);
						z-index: 2;

						.crown-image {
							width: 40rpx;
							height: 30rpx;
						}
					}
				}

				.user-detail {
					.user-name {
						font-size: 32rpx;
						font-weight: 500;
						color: #fff;
						margin-bottom: 10rpx;
					}

					.invite-code {
						font-size: 24rpx;
						color: rgba(255, 255, 255, 0.8);
					}
				}
			}

			.user-right {
				text-align: right;

				.yesterday-income {
					.income-amount {
						font-size: 32rpx;
						font-weight: bold;
						color: #fff;
						display: block;
						margin-bottom: 5rpx;
					}

					.income-label {
						font-size: 24rpx;
						color: rgba(255, 255, 255, 0.8);
					}
				}
			}
		}

		/* 身份申请区域 */
		.identity-section {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 20rpx;

			.identity-list {
				display: flex;
				flex: 1;
				justify-content: space-between;

				.identity-item {
					display: flex;
					flex-direction: column;
					align-items: center;
					gap: 10rpx;

					.identity-icon {
						width: 60rpx;
						height: 60rpx;
					}

					.identity-text {
						font-size: 20rpx;
						color: rgba(255, 255, 255, 0.9);
					}
				}
			}

			.apply-btn {
				background-color: #FF7F29;
				border-radius: 50rpx;
				padding: 15rpx 40rpx;
				margin-left: 30rpx;

				.apply-text {
					font-size: 32rpx;
					color: #fff;
					font-weight: 500;
				}
			}
		}
	}



	/* 钱包信息 */
	.wallet-section {
		background-color: #fff;
		margin: 0rpx 30rpx 0;
		border-radius: 16rpx 16rpx 0 0;
		display: flex;
		align-items: center;
		border-bottom: rgba(0, 0, 0, 0.1) solid;

		.wallet-item {
			flex: 1;
			padding: 40rpx 0;
			display: flex;
			align-items: center;
			justify-content: center;

			.wallet-label {
				font-size: 28rpx;
				color: #999;
			}

			.wallet-value {
				font-size: 32rpx;
				font-weight: bold;
				color: #FD4F50;
				margin-left: 10rpx;
			}
		}

		.wallet-divider {
			width: 2rpx;
			height: 60rpx;
			background-color: rgba(0, 0, 0, 0.1);
		}
	}

	/* 功能快捷入口 */
	.quick-entry {
		background-color: #fff;
		margin: 0 30rpx 30rpx;
		border-radius: 0 0 16rpx 16rpx;
		padding: 40rpx 0;
		display: flex;
		justify-content: space-around;

		.divider {
			width: 2rpx;
			height: 80rpx;
			background-color: rgba(0, 0, 0, 0.1);
		}

		.entry-item {
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: 15rpx;

			.entry-icon {
				width: 50rpx;
				height: 50rpx;
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.profit-icon {
				width: 45rpx;
				height: 50rpx;
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.team-icon {
				width: 55rpx;
				height: 50rpx;
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.entry-text {
				font-size: 26rpx;
				color: #333;
			}
		}
	}

	/* 订单管理 */
	.order-section {
		background-color: #fff;
		margin: 0 30rpx 30rpx;
		border-radius: 16rpx;
		box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);

		.line {
			width: 100%;
			height: 2rpx;
			background-color: rgba(0, 0, 0, 0.1);
		}

		.section-header {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 40rpx;

			.header-title {
				font-size: 32rpx;
				font-weight: bold;
				color: #333;
			}

			.header-action {
				display: flex;
				align-items: center;

				.action-text {
					font-size: 26rpx;
					color: #999;
					margin-right: 10rpx;
				}
			}
		}

		.order-status {
			display: flex;
			justify-content: space-between;
			padding: 40rpx;

			.status-item {
				display: flex;
				flex-direction: column;
				align-items: center;
				gap: 15rpx;
				position: relative;

				.status-icon {
					position: relative;
					width: 80rpx;
					height: 80rpx;
					border-radius: 50%;
					display: flex;
					align-items: center;
					justify-content: center;
				}

				.status-text {
					font-size: 26rpx;
					color: #333;
				}

				.order-badge {
					position: absolute;
					top: -10rpx;
					right: 10rpx;
					background-color: #FD4F50;
					color: #fff;
					border-radius: 50%;
					width: 36rpx;
					height: 36rpx;
					font-size: 22rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					min-width: 36rpx;
					border: 2rpx solid #fff;
				}
			}
		}
	}

	/* 安全协议弹窗样式 */
	.agreement-modal {
		max-height: 70vh;
		padding: 20rpx;

		.agreement-title {
			font-size: 32rpx;
			font-weight: bold;
			color: #333;
			text-align: center;
			padding-bottom: 20rpx;
		}

		.agreement-content {
			max-height: 50vh;

			.agreement-text {
				line-height: 1.6;

				.company-info {
					display: block;
					font-size: 28rpx;
					color: #333;
					// margin-bottom: 20rpx;
					font-weight: 500;
				}

				.agreement-intro {
					display: block;
					font-size: 26rpx;
					color: #666;
					// margin-bottom: 30rpx;
					text-indent: 2em;
				}

				.section-title {
					display: block;
					font-size: 28rpx;
					color: #333;
					font-weight: 500;
					// margin: 25rpx 0 15rpx 0;
				}

				.clause-item {
					display: block;
					font-size: 26rpx;
					color: #666;
					// margin-bottom: 10rpx;
					padding-left: 20rpx;
				}

				.final-note {
					display: block;
					font-size: 26rpx;
					color: #999;
					text-align: center;

				}
			}
		}
	}

	::v-deep .u-modal__content {
		padding: 0;
	}
</style>